<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ include file="/include/taglibs.jsp" %>
<html>
<head>
  <title>选择角色</title>
  <link rel="stylesheet" href="${ctx}/assets/admin/LingUI/css/ui.jqgrid.css"/>
  <%@ include file="/include/openstyles.jsp" %>
  <style>
    .help-block {
      margin: 0px !important;
    }
  </style>
</head>
<body>
<div class="row" style="padding: 10px">
  <div class="col-xs-12">
    <div id="search"></div>
    <%--查询条件更多 --%>
    <div class="b_grid_line  col-lg-12"></div>                        <!-- 分隔线 -->
    <table id="role_list_table" class="grid-table"></table>
    <%--jqgrid数据表格 --%>
    <div id="role_list_pager"></div>
    <%--jqgrid表格 页脚 --%>
  </div>
</div>
<script type="text/javascript">
  var scripts = [null,
    "${ctx}/assets/admin/LingUI/js/jqGrid/jquery.jqGrid.js",
    "${ctx}/assets/admin/LingUI/js/jqGrid/i18n/grid.locale-cn.js",
    "${ctx}/assets/admin/LingUI/js/control.js",
    "${ctx}/assets/admin/LingUI/js/jsutil/js/jquery.filterSearch.js",   //筛选搜索
    "${ctx}/assets/admin/pagejs/common.js",
    null];
  var _grid_id = "#role_list_table";	//表格 选择器
  var _pager_id = "#role_list_pager";	//表格页脚 选择器
  ace.load_ajax_scripts(scripts, function () {
    $("#search").strongFilterSearch({
      inputFiled: "s_value",				//搜索字段，不填默认为searchValue
      inputPlaceholder: "请输入用户编号或者中文名称",		//占位符
      searchCallback: callback//,				//搜索按钮点击后回调
    });
    //搜索回调函数
    function callback(data) {
      jQuery("#role_list_table").jqGrid('setGridParam', {
        url: "${ctx}/${frameworkPath}/role/index?sort=ROLE_ORDER&&dir=asc",
        mtype: "POST",
        postData: {ROLE_NAME:data.s_value} //传递的数据
      }).trigger("reloadGrid");
    }

    //调整以适应页面大小  其中 $(".page-content") 为jqgrid的父级容器
    $(window).off('resize.jqGrid').on('resize.jqGrid', function () {
      setTimeout(function () {
        $(_grid_id).jqGrid("setGridWidth", $(".page-content").width());
        $(".ui-jqgrid-bdiv").width($(".page-content").width() + 1);
      }, 50);
    });
    jQuery(_grid_id).jqGrid({
      mtype: "POST",
      url: "${ctx}/${frameworkPath}/role/index?sort=ROLE_ORDER&&dir=asc",
      colNames: ['编号', '角色名称', '创建者', '创建时间'],
      colModel: [
        {name: 'id', index: 'id', width: 0, editable: true, hidden: false},
        {name: 'name', index: 'name', width: 0, editable: true},
        {name: 'creator', index: 'creator', width: 60, editable: true},
        {name: 'created', index: 'created', width: 60, editable: true, align: 'center'}
      ],
      pager: _pager_id, //分页信息 放置的位置
      page: lui.pageNum(_grid_id)
    });
  });

  function getRoles() {
    var retObj = new Object();
    retObj.state = true;
    var ids = $("#role_list_table").jqGrid('getGridParam', 'selarrrow');
    if (ids.length < 1) {
      lui.warn('至少选择一行数据');
      return;
    }
   /* else if (ids.length > 1) {
      lui.warn("最多选择一行数据");
      return;
    }*/
    var checkedRoles = new Array();
    var checkedRoleNames = new Array();
    jQuery(ids).each(function (index, element) {
      var rowData = $('#role_list_table').jqGrid('getRowData', element);
      checkedRoles.push(rowData.id);
      checkedRoleNames.push(rowData.name);
    });

    retObj.checkedRoles=checkedRoles;
    retObj.checkedRoleNames=checkedRoleNames;

    return retObj;
  }
</script>
</body>
</html>